<template>
    <div>
      <!-- 排片计划页面 -->
      <b style="color:#409EFF;">{{cinemaRoom.cinema_name}}</b> 
      的 
      <b style="color:#409EFF;">{{cinemaRoom.cinema_room_name}} ({{cinemaRoom.cinema_room_type}})</b> 
      的排片计划列表
  
      <!-- 分割线 -->
      <el-divider></el-divider>
  
      <!-- 显示表格 -->
      <el-table :data="plans">
        <el-table-column prop="title" label="电影名称" align="center"></el-table-column>
        <el-table-column prop="showingon_date" label="上映时间" align="center"></el-table-column>
        <el-table-column prop="showingon_time" label="场次" align="center"></el-table-column>
        <el-table-column label="票价" align="center">
          <template slot-scope="scope">
            ￥{{scope.row.price}}
          </template>
        </el-table-column>
        <el-table-column label="是否发布" align="center">
          <template slot-scope="scope">
            <el-switch 
              v-model="scope.row.status" 
              :active-value="1" :inactive-value="0"/>
          </template>
        </el-table-column>
        <el-table-column label="操作" align="center">
          <el-button size="small" circle icon="el-icon-delete" type="danger"></el-button>
        </el-table-column>
      </el-table>
   
    </div>
  </template>
  
  <script>
  import httpApi from '@/http';
  export default {
    data() {
      return {
        roomId: this.$route.params.roomId,
        cinemaRoom: {}, // 存储当前选中的放映厅对象
        plans: [],  // 保存排片计划列表
      };
    },
  
    methods: {
  
      /** 列出当前放映厅排片计划列表 */
      listPlans(){
        httpApi.ShowingonPlanApi
          .queryByRoomId({room_id:this.roomId}).then(res=>{
          console.log('加载当前放映厅的排片计划列表：', res)
          this.plans = res.data.data
        })
      },
  
      /** 加载放映厅的基本信息 */
      loadRoomInfo() {
        let params = {id: this.roomId}
        httpApi.CinemaRoomApi.queryById(params).then(res=>{
          console.log('查询放映厅的基本信息', res)
          this.cinemaRoom = res.data.data
        })
      }
  
    },
  
    mounted(){
      // 加载放映厅的基本信息
      this.loadRoomInfo()
      // 加载该放映厅下的排片计划列表
      this.listPlans()
    }
  };
  </script>
  
  <style lang="scss" scoped></style>
  